<template>
    <div id="cesiumContainer"></div>
</template>

<script>
    import * as Cesium from 'cesium/Cesium'

    export default {
        name: 'OrientedBoundingBox',
        data() {
            return {}
        },
        mounted() {
            this.initCesium();
            this.addBoundingBox();
        },
        methods: {
            initCesium: function () {
                this.viewer = new Cesium.Viewer('cesiumContainer', {
                    animation: false,
                    baseLayerPicker: false,
                    fullscreenButton: false,
                    geocoder: false,
                    homeButton: false,
                    infoBox: true,
                    sceneModePicker: false,
                    navigationHelpButton: false,
                    scene3DOnly: true,
                    timeline: false,
                    selectionIndicator: false,//是否显示选取指示器组件
                    shouldAnimate: false,     //自动播放动画控件
                    shadows: true,//是否显示光照投射的阴影
                    terrainShadows: Cesium.ShadowMode.RECEIVE_ONLY,//地质接收阴影
                    sceneMode: Cesium.SceneMode.SCENE3D,
                    imageryProvider: new Cesium.ArcGisMapServerImageryProvider({
                        url: "https://server.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer?f=jsapi"
                    })
                });
                this.viewer._cesiumWidget._creditContainer.style.display = "none";  //	去除版权信息
            },
            addBoundingBox() {
                //构建obb包围盒的所有的点坐标
                const positions = Cesium.Cartesian3.fromDegreesArray([
                    113.23279023170471,
                    23.0951874543701,
                    113.23238253593443,
                    23.09495059893952,
                    113.23276877403259,
                    23.094397934644462,
                    113.23265075683594,
                    23.093973565874975,
                    113.23480725288391,
                    23.093993303987,
                    113.23536515235901,
                    23.09463479104927,
                    113.23449611663817,
                    23.09540457148131,
                    113.23279023170471,
                    23.0951874543701
                ]);
                //构建多边形几何体的实例
                let polygon = new Cesium.PolygonGeometry({
                    polygonHierarchy: new Cesium.PolygonHierarchy(positions)
                });
                let geometry = Cesium.PolygonGeometry.createGeometry(polygon);
                let instance = new Cesium.GeometryInstance({
                    geometry: geometry,
                    attributes: {
                        color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.BLUE)
                    },
                    id: 'polygonInstance'
                });

                // Cesium.OrientedBoundingBox.fromPoints()
                //用所有的点计算出OBB包围盒
                let obb1 = Cesium.OrientedBoundingBox.fromPoints(positions);

                console.log(obb1)
                // Cesium.BoxGeometry.createGeometry()

                // Cesium.OrientedBoundingBox.fromRectangle()
                // Cesium.OrientedBoundingBox.fromCorners()
                // Cesium.OrientedBoundingBox.fromTransformation()

                // new Cesium.OrientedBoundingBox()
                //指定OBB包围盒的中心点
                const center = new Cesium.Cartesian3(1.0, 0.0, 0.0);
                //围绕中心点位置的变换矩阵
                const halfAxes = Cesium.Matrix3.fromScale(new Cesium.Cartesian3(1.0, 3.0, 2.0), new Cesium.Matrix3());

                const obb2 = new Cesium.OrientedBoundingBox(center, halfAxes);
                console.log(obb2)
                //添加图元
                let primitive = new Cesium.Primitive({
                    geometryInstances: [instance],
                    asynchronous: false,//是否采用多线程
                    appearance: new Cesium.PerInstanceColorAppearance({
                        translucent: true,
                        closed: true
                    })
                });
                this.viewer.scene.primitives.add(primitive);

                //定位
                this.viewer.camera.flyTo({
                    destination: Cesium.Cartesian3.fromDegrees(113.23276877403259, 23.094397934644462, 2000.0), // 设置位置
                    orientation: {
                        heading: Cesium.Math.toRadians(20.0), // 方向
                        pitch: Cesium.Math.toRadians(-90.0),// 倾斜角度
                        roll: 0
                    }
                })
            }
        },

    }
</script>

